<template>
  <tiny-grid
      :data="resourceList"
      border
      :loading="tableLoading"
      :stripe="true"
      style="width: 788px"
  >
    <tiny-grid-column type="index" width="60"></tiny-grid-column>
    <tiny-grid-column field="name" title="名称" width="300"></tiny-grid-column>
    <tiny-grid-column field="uploadUser" title="上传人" width="150"></tiny-grid-column>
    <tiny-grid-column field="createTime" title="上传日期" width="200"></tiny-grid-column>
    <tiny-grid-column title="操作" width="70">
      <template #default="data">
        <tiny-button size="mini" @click="handleDownload(data.row,data.row.name)">下载</tiny-button>
      </template>
    </tiny-grid-column>
  </tiny-grid>
<!--  <tiny-pager-->
<!--      layout="total, sizes, prev, pager, next, jumper"-->
<!--      :current-page="pageNum"-->
<!--      :page-size="pageSize"-->
<!--      :total="1000"-->
<!--      :page-sizes="[5, 10, 20, 40]"-->
<!--  >-->
<!--  </tiny-pager>-->
</template>

<script setup>
import {useRoute} from "vue-router";
import {onMounted, onUnmounted, ref} from "vue";
import {useAsideStore} from "../store/useAsideStore.js";
import {
  Grid as TinyGrid,
  GridColumn as TinyGridColumn,
  Button as TinyButton,
  Pager as TinyPager
} from '@opentiny/vue'
import {useResourceStore} from "../store/useResourceStore.js";
import {storeToRefs} from "pinia";
import request from "../utils/request.js";


const resourceStore = useResourceStore()
const {resourceList} = storeToRefs(resourceStore)
const asideStore = useAsideStore()
const route = useRoute()
const tableLoading = ref(false)
const pageNum = ref(1)
const pageSize = ref(15)



// 下载资源
const handleDownload = (row,name) => {
  request.get(`/api/file/download?fileName=${row.fileName}`, {
    responseType: 'blob',
  }).then(res => {
    const data = res
    let url = window.URL.createObjectURL(data) // 将二进制文件转化为可访问的url
    let a = document.createElement('a')
    document.body.appendChild(a)
    a.href = url
    const pointIndex = row.fileName.lastIndexOf(".");
    a.download = name + row.fileName.substring(pointIndex,row.fileName.length)
    a.click() // 模拟点击下载
    window.URL.revokeObjectURL(url)
  })
}

onMounted(() => {
  if (route.name === 'Resource') {
    asideStore.asideWidth = '275px'
    asideStore.existFlag = true
  }
})
onUnmounted(() => {
  asideStore.asideWidth = '150px'
  asideStore.existFlag = false
})


</script>

<style scoped>

</style>
